<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<% String path = request.getContextPath() ;%>
<%@ taglib uri="/WEB-INF/tld/c.tld" prefix="c" %> 
<%@ taglib uri="/WEB-INF/tld/fmt.tld" prefix="fmt" %>
<%@ taglib uri="/WEB-INF/tld/ui.tld" prefix="ui" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>DEMO信息</title>
<jsp:include page="../../import.jsp" flush="true" />
</head>
<body class="iframeBody">
    <div class="Wrapper">
        <div>
            <div id="pageInTab" class="pageInTab">
                <div tabid="tabA" title="基本信息" lselected="true">
                    <form id="formSet1">
                    	<hr color="red" width="100%"/>
                        <div class="fieldset1 tabel_col tabel_col_s clearFix">
			                <div id="dyncdiv">
			                	<jsp:include page="../../demo/demo/dynamicPage.jsp"></jsp:include>
			                </div>
                        </div>
                        <div class="btnsBox">
                            <span id="testBtn" class="sq-button sq-button-hasicon"><i class="sqBtnIco_10"></i>动态标准组件刷新</span>
                        </div>
                        <hr color="red" width="100%"/>
                         <div class="fieldset1 tabel_col tabel_col_s clearFix">
			                <div id="dyncBizdiv">
			                	<jsp:include page="../../demo/demo/dynamicBizPage.jsp"></jsp:include>
			                </div>
                       
                        <div class="fieldBox col_33">
			                    <div class="label">业务类型(<font color="red">刷新使用</font>)</div>
			                    <div class="field">
			                        <select name="bizTypCd" id="bizTypCd" data-value="" validate="{required:true, select: true}">
			                         	<option bizTypCd="PRD9999" value="001">卡车（特种/工程/公路）</option>
			                         	<option bizTypCd="PRD9999" value="002">乘用车</option>
			                         	<option bizTypCd="PRD9999" value="003">客车</option>
			                        </select>
			                    </div>
			            </div>
			             </div>
                        <div class="btnsBox">
                            <span id="testBtn" class="sq-button sq-button-hasicon"><i class="sqBtnIco_10"></i>动态业务类型组件刷新(右侧下拉框)</span>
                        </div>
                         <hr color="red" width="100%"/>
                         
                         <!-- 选择下拉框数据重新设置指定下拉框数据 -->
                         <div class="fieldset1 tabel_col tabel_col_s clearFix">
                         	<ui:normalSelect pgCd="TPage01" cmpCd="TCmp01" cmpDtlCd="TPgFld02"></ui:normalSelect>
			               	<div class="fieldBox col_33">
			                    <div class="label">品牌</div>
			                    <div class="field">
			                        <select name="brand" id="brand" data-value="" validate="{required:true, select: true}">
			                           <option value=" " checked >请选择</option>
			                        </select>
			                        <span class="requiredSymbol">*</span>
			                    </div>
			                </div>
			                <!-- 选择类型后动态显示的组件列表, 实现后这里可以把内容删除掉,这里只是个例子,要不然会空跑一次 -->
			                <div id="dyncSelect01Bizdiv">
			                	<jsp:include page="../../demo/demo/dynamicSelect01BizPage.jsp"></jsp:include>
			                </div>
			             </div>
                        <div class="btnsBox">
                            <span id="testBtn" class="sq-button sq-button-hasicon"><i class="sqBtnIco_10"></i>动态业务类型组件刷新其它组件</span>
                        </div>
                        <hr color="red" width="100%"/>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <script>
    $(function() {
        initData();//初始化数据
        initEvent();//初始化事件
    });
    
    //初始化数据
    function initData(){
    	$("#formSet1").ligerForm();
    }
    
  	//初始化事件
    function initEvent(){
    	btnEvent();
    	bizTypCdEvent();
    	tPgFld02Event();
	}
  	
    //业务类型(刷新使用)
    function bizTypCdEvent(){
    	$("#bizTypCd").change(function(event) {
            var val =$(this).val();
            var op = liger.get("bizTypCd").element.selectedOptions;
            //alert("val:" + val +" ___ text:"+text);
            var _url = '<%=path%>/demo/demo/toDynamicBizPage.do';
    		//如果有参数则在第二个参数中传入
    		$("#dyncBizdiv").load(_url,{bizTypCd:$(op).attr("bizTypCd"), bizCd:val},function(responseText,textStatus){
    			dynamicBizPageUIInst();//重新设置字段样式,本方法应该在动态页面中自己根据动态字段写好
    		});
        });
    };
    
    //业务类型(测试选项后拿到额外值传递到指定组件)
    function tPgFld02Event(){
    	$("#TPgFld02").change(function(event) {
            var val =$(this).val();
            //alert("val:" + val + "  --- sGrpCd:" + $(this).attr("sGrpCd") + " -- sCode:" + $(this),attr("sCode"));
            var op = liger.get("TPgFld02").element.selectedOptions;
			//alert($(op).attr("sGrpCd") + "-" + $(op).attr("sCode"));
    		//要通过参数获取数据列表赋值到其它组件选项中
			$.ajax({
           		type: 'post',
           		dataType:'json',
           		data:{mTypCd:'M0001',sGrpCd:$(op).attr("sGrpCd"),sCode:$(op).attr("sCode")},
           		url: '<%=path%>/demo/demo/searchSysCdMapDWithTargetAtomForSelect.do',
           		success:function(msg){
           			 if(msg.success == 1){
           				 //设置品牌值
           				 $("#brand").empty();
           				$.each(msg.data,function(index,obj) {
           					//alert(obj.sGrpCd);
           					//$("#brand").append("<option value=''>请选择</option>");
           					var option = "<option sGrpCd='"+obj.sGrpCd+"' sCode='"+obj.sCode+"' value='"+obj.tCode+"'>"+obj.tCodeNm+"</option>";
           					$(option).appendTo("#brand");
           				 	liger.get("brand").setSelect();
           				});
           				$("#brand").add_ligerFormEditor();
           			 }else{
                        
           			 }
           		}
            });
    		
			//刷新组件是否显示
			var _url = '<%=path%>/demo/demo/toDynamicSelect01BizPage.do';
	    	//如果有参数则在第二个参数中传入
	    	$("#dyncSelect01Bizdiv").load(_url,{bizTypCd:$(op).attr("sGrpCd"), bizCd:val},function(responseText,textStatus){
	    		dynamicSelect01BizPageUIInst();//重新设置字段样式,本方法应该在动态页面中自己根据动态字段写好
	    	});
    		
        });
    };
    
    //保存事件
    function btnEvent(){
    	$("#testBtn").click(function(event) {
    		var _url = '<%=path%>/demo/demo/toDynamicPage.do';
    		//如果有参数则在第二个参数中传入
    		$("#dyncdiv").load(_url,{},function(responseText,textStatus){
    			dynamicPageUIInst();//重新设置字段样式,本方法应该在动态页面中自己根据动态字段写好
    		});
        });
    };
    
    
    </script>
</body>
</html>